<template>
	<div>
		<ul class="mui-table-view mui-unfold">
			<li class="mui-table-view-cell mui-collapse mui-media mui-media-icon" v-for="item in  newsList":key="item.id">
				<router-link :to="'/index/newsinfo/'+item.id">
					<div class="mui-media-object mui-pull-left">
						<!--<span class="mui-icon mui-icon-contact"></span>-->
						<img style="margin-top: 0.8rem;" :src="item.img_url">
					</div>
					<div class="mui-media-body">
						<h1>{{item.title}}</h1>
						<p class="mui-ellipsis">
							<span>{{item.add_time | dateFormat}} </span>
							<span>点击：{{item.click}}次</span>
						</p>
					</div>
				</router-link>

			</li>
			
			

		</ul>
	</div>
</template>

<script>
	import {Toast}  from  'mint-ui'
	export default({
		data() {
			
			return {
           newsList:[]
			}
		},
		created(){
			this.getNewsList()
		},
		methods: {
         getNewsList(){
         	this.$http.get('api/getnewslist').then(function(data){
         		
         		if(data.body.status==0){
         			this.newsList=data.body.message
         		
         		}else{
         			Toast('获取新闻资讯失败！')
         		}
         		
         	})
       
         }
		}
	})
</script>

<style scoped="" lang="less">
	.mui-media-body {
		h1 {
			font-size: 14px
		}
		.mui-ellipsis {
			font-size: 12px;
			color: #007AFF;
			display: flex;
			justify-content: space-between;
		}
	}
</style>